import React, { useState, FC } from 'react';
import type { MenuProps } from 'antd';
import DiscoverNavBarData from '@/assets/data/discover-menus.json';
import { Tabs } from 'antd';
import type { TabsProps } from 'antd';
import Recommend from '../c-views/Recommend';

const onChange = (key: string) => {
    console.log(key);
};

const items: TabsProps['items'] = [
    {
        key: '1',
        label: 'Tab 1',
        children: 'Content of Tab Pane 1',
    },
    {
        key: '2',
        label: 'Tab 2',
        children: 'Content of Tab Pane 2',
    },
    {
        key: '3',
        label: 'Tab 3',
        children: 'Content of Tab Pane 3',
    },
];

type MenuItem = Required<MenuProps>['items'][number];

const navbars: TabsProps['items'] = DiscoverNavBarData.map((item, index) => ({
    key: item.link,
    label: item.title,
    children: <Recommend />
}))


const NavTabs: FC = () => {
    return <Tabs style={{ margin: 0 }} defaultActiveKey="1" items={navbars} onChange={onChange} />
};

export default NavTabs;




